<template>
  <div>
    <span>参数类型：</span>
    <RadioGroup v-model="parameter_type" style="margin-bottom: 10px">
      <Radio label="json"></Radio>
      <Radio label="form-data"></Radio>
      <Radio label="x-www-form-urlencoded"></Radio>
    </RadioGroup>
    <vue-json-editor v-model="parameters_obj" :mode="'code'" lang="zh"/>
  </div>
</template>

<script>
import vueJsonEditor from "vue-json-editor";

export default {
  name: "Body",
  props: {
    type: String,
    parameters: Object
  },
  components: {
    vueJsonEditor
  },
  data() {
    return {
      parameter_type: "",
      parameters_obj: ""
    }
  },
  computed: {
    obj() {
      const {parameter_type, parameters_obj} = this;
      console.log(parameter_type, "000")
      return {
        parameter_type, parameters_obj
      }
    }
  },
  watch: {
    'type': {
      deep: true,
      immediate: true,
      handler: function (v) {
        this.parameter_type = v
      }
    },
    'parameters': {
      deep: true,
      immediate: true,
      handler: function (v) {
        console.log(v, '-------', '99999')
        this.parameters_obj = v
      }
    },
    obj: {
      handler(v) {
        this.$emit("changeBody", v)
      },
      deep: true
    }
  }
}
</script>

<style scoped>

</style>
<style>
.jsoneditor {
  height: 310px !important;
}
</style>
